 // API配置
 const API = {
    // 分类接口（示例）
    categories: '/api/categories',
    // 歌单接口（示例）参数: ?category={category}
    playlists: '/api/playlists'
};

// 模拟分类数据（实际使用请删除）
const mockCategories = [
    { id: 1, name: '全部歌单', code: 'all' },
    { id: 2, name: '华语歌曲', code: 'chinese' },
    { id: 3, name: '欧美歌曲', code: 'western' },
    { id: 4, name: '日语歌曲', code: 'japanese' }
];

// 模拟歌单数据（实际使用请删除）
const mockPlaylists = {
    chinese: [
        { id: 1, title: '经典华语', author: '怀旧音乐馆', cover: 'https://picsum.photos/200/200?c1' },
        // 更多数据...
    ],
    // 其他分类数据...
};

// 初始化函数
$(document).ready(function() {
    // 加载分类数据
    loadCategories().then(initCategories);
    
    // 默认加载全部歌单
    loadPlaylists('all');
});

// 加载分类数据（对接API）
function loadCategories() {
    return $.ajax({
        url: API.categories,
        method: 'GET',
        // 实际使用时删除success回调
        success: function(response) {
            return response.data || mockCategories;
        }
    }).fail(() => mockCategories); // 模拟数据回退
}

// 初始化分类列表
function initCategories(categories) {
    const $container = $('#category-list');
    categories.forEach(cat => {
        $container.append(`
            <div class="language-filter" 
                 data-category="${cat.code}"
                 onclick="loadPlaylists('${cat.code}')">
                ${cat.name}
            </div>
        `);
    });
    // 设置默认选中
    $('[data-category="all"]').addClass('active');
}

// 加载歌单数据（对接API）
async function loadPlaylists(category) {
    showLoading();
    
    try {
        // 实际API请求
        const response = await $.ajax({
            url: API.playlists,
            method: 'GET',
            data: { category },
            // 实际使用时删除success回调
            success: function(res) {
                return res.data || mockPlaylists[category] || [];
            }
        });

        renderPlaylists(response);
        updateActiveCategory(category);
    } catch (error) {
        console.error('加载失败:', error);
    } finally {
        hideLoading();
    }
}

// 渲染歌单列表
function renderPlaylists(playlists) {
    const $container = $('#playlist-container').empty();
    playlists.forEach(playlist => {
        $container.append(`
            <div class="col-sm-6 col-md-4 playlist-item">
                <div class="thumbnail">
                    <div class="playlist-cover" 
                         style="background-image: url('${playlist.cover}')"></div>
                    <div class="playlist-info">
                        <h4 class="playlist-title">${playlist.title}</h4>
                        <p class="playlist-author">by ${playlist.author}</p>
                    </div>
                </div>
            </div>
        `);
    });
}

// 更新激活分类
function updateActiveCategory(category) {
    $('.language-filter').removeClass('active');
    $(`[data-category="${category}"]`).addClass('active');
}

// 显示/隐藏加载状态
function showLoading() { $('.loading').show(); }
function hideLoading() { $('.loading').hide(); }